<template>
    <div class="feedback">
        <!-- 头部导航 -->
        <div class="header">
            <van-nav-bar
                title="不凡"
                left-text="返回"
                left-arrow
                @click-left="onClickLeft"
            />
        </div>
        <div class="content">
            <van-field label="意见与反馈" readonly />
            <van-field
                v-model="message"
                rows="2"
                autosize
                label="留言"
                type="textarea"
                maxlength="50"
                placeholder="请输入留言"
                show-word-limit
            />
            <van-cell-group>
                <van-field  v-model="phone" label="联系方式" placeholder="邮箱/手机号/微信号" />
            </van-cell-group>
            <van-button @click="submit" class="btn" type="primary" block color="#b4282d">块级元素</van-button>
        </div>
    </div>
</template>

<script>
import { addFeedbackInfo } from '@/api/my/feedback/index'

    export default {
        data() {
            return {
                message: '',
                phone: '',
                openId: localStorage.getItem('openId')
            }
        },
        methods: {
            // 返回
            onClickLeft() {
                this.$router.go(-1);
            },
            // 点击提交
            submit() {
                addFeedbackInfo({
                    content: this.message,
                    name: '意见',
                    openId: this.openId,
                    phone: this.phone
                })
                .then(res => {
                    console.log(res);
                })
                this.message = '';
                this.phone = '';
            }
        }
    }
</script>

<style lang="scss" scoped>
    .feedback{
        width: 100%;
        .header{
            background: #fff;
        }
        .content{
            width: 100%;
            .btn{
                margin: 50px auto 0 auto;
                width: 90%;
            }
        }
    }
</style>
